<template>
<div class="layout bg-color-gray">
  <div class="footer layout-container">
    <div class="logo">
      <img src="../../assets/images/logo-footer.png" alt="">
    </div>
    <div class="footer-info">
      <p class="m-b-14">{{ $t('footer.programQuestion') }}</p>
      <i18n path="footer.p1">
        <a place="faq" href="#">{{ $t('footer.FAQ') }}</a>
      </i18n>
      <div class="m-b-14">{{ $t('footer.email')}}</div>
      <p class="m-b-14">{{ $t('footer.p2') }}</p>
      <div class="link">
        <a href="#">{{ $t('footer.link[0]') }}</a>
        |
        <a href="#">{{ $t('footer.link[1]') }}</a>
      </div>
      <div class="copyright">{{ $t('footer.copyright') }}</div>
    </div>
  </div>
</div>
</template>

<script>
export default {
  name: "Footer"
}
</script>

<style scoped>
.footer {
  height: 194px;
  display: flex;
  /*margin-top: 40px;*/
}
.footer > .logo {
  width: 152px;
  height: 194px;
  display: flex;
  align-items: center;
}
.footer > .footer-info {
  width: 1128px;
  padding-top: 24px;
  font-size: 12px;
  color: #333333;
}
.footer > .footer-info a {
  color: #0068B5;
  text-decoration: none;
}
.m-b-14 {
  margin-bottom: 14px;
}
</style>
